<template>
	<view class="page">
		<view class="login">
			<view class="title">
				<text>意家</text>
			</view>
			<uni-forms :modelValue="formData" :rules="rules" ref="form">
				<uni-forms-item label="主账号" name="parent_username">
					<uni-easyinput type="text" v-model="formData.parent_username" placeholder="请输入主账号" />
				</uni-forms-item>
				<uni-forms-item label="账号" name="child_username">
					<uni-easyinput type="text" v-model="formData.child_username" placeholder="请输入账号" />
				</uni-forms-item>
				<uni-forms-item label="密码" name="password">
					<uni-easyinput type="text" v-model="formData.password" placeholder="请输入密码" />
				</uni-forms-item>
			</uni-forms>
			<view class="pasw">
				<checkbox-group @change="push_pass">
					<label>
						<checkbox value="1" checked="true" color="#46822a" style="transform:scale(0.7)" />记住密码
					</label>
				</checkbox-group>
			</view>
			<button @click="submitForm">登录</button>
		</view>
		<appUpdate v-if="show" :upTit="upTit" :infoList="infoList" :downUrl="downUrl" @close="close"
			@updateSucc="updateSucc" @updateErro="updateErro" @downOver="downOver" @maskClick="maskClick"></appUpdate>
	</view>
</template>
<script>
	import { getCurrentVersion } from "@/api/index.js"
	import appUpdate from '../components/app-update/app-update.vue'
	export default {
		components: {
			appUpdate
		},
		data() {
			return { 
				show:false,
				upTit: '升级标题',
				infoList: [	
					'1.更新已知问题',
					// "1.更新了手机爆炸的按钮",
					// "2.更新了一键格式化手机的按钮"
				],
				downUrl: "https://zjzl.likai.vip/app/zjzl.apk", //likaI
				formData: {
					is_primary: '2',
					child_username: '',
					parent_username:  '',
					password: '' 
				},
				rules: {
					child_username: {
						rules: [{
							required: true,
							errorMessage: '请输入账号',
						}]
					},
					parent_username: {
						rules: [{
							required: true,
							errorMessage: '请输入主账号',
						}]
					},
					password: {
						rules: [{
							required: true,
							errorMessage: '请输入密码',
						}]
					}
				},
				isjizhu: true
			}
		},
		created() {
			
		},
		onBackPress() {
			const pages = getCurrentPages();
			uni.switchTab({
				url: '/' + pages[pages.length - 2].route
			});
			return true;
		},
		mounted() {
			if (uni.getStorageSync('user_pass')) {
				let user = uni.getStorageSync('user_pass')
				this.formData.child_username = user.child_username
				this.formData.parent_username = user.parent_username
				this.formData.password = user.password
			}
			 // #ifdef APP-PLUS
			     this.isUpdate()
			 // #endif   
		},
		methods: {
			ComparativeVersion(oldV,newV) {
			       // 先把版本切成数组
			       let oldArr = oldV.split('.');
			       let newArr = newV.split('.');
			        // 循环对比每一位，发现新版本比较大，就 返回 true，新版本小就返回 false；
			        for (let index = 0; index < oldArr.length; index++) {
			         const oldItem = Number(oldArr[index]);
			         const newItem = Number(newArr[index]);
			          if (newItem > oldItem) {
			            return true;
			          }else if(newItem < oldItem){
			            return false;
			          }
			        }
			        // 若循环对比结束，说明版本一致，就返回false;
			        return false;
			},
			isUpdate() {
				getCurrentVersion().then(res=>{ 
					if(res.code==200){
						let isup=this.ComparativeVersion(plus.runtime.version,res.data.version)
						if(isup)
						this.show = true
						console.log(isup)
					}
				})		
			},
			open() {
				this.show = true
			},
			close() {
				console.log("关闭弹窗")
				this.show = false
			},
			updateSucc() {
				console.log("监听安装成功")
				
			},
			updateErro() {
				console.log("监听安装失败")
			},
			downOver() {
				console.log("监听文件下载成功")
			},
			maskClick() {
				console.log("遮罩层呗点击")
				this.show = false
			},
			push_pass(val) {
				if (val.detail.value[0] == 1) {
					this.isjizhu = true
				}
			},
			submitForm() {
				this.$refs.form.validate().then(res => {
					this.$store.dispatch('login', this.formData).then((res) => {
						if (this.isjizhu == true) {
							let user = {
								child_username: this.formData.child_username,
								parent_username: this.formData.parent_username,
								password: this.formData.password,
							}
							console.log(user)
							uni.setStorageSync('user_pass', user)
						} else {
							uni.showToast({
								icon: 'none',
								title: '没有记住密码哦~'
							})
						}
						if (res.code == 200) {
							uni.showToast({
								icon: 'none',
								title: '登录成功,正在跳转~'
							})
							this.$store.dispatch('get_Menu')
							setTimeout(function() {
								uni.switchTab({
									url: './mine/index'
								});
							}, 1000)

						} else {
							uni.showToast({
								icon: 'none',
								title: res.msg
							})
						}
					})
					console.log('表单数据信息：', res);
				}).catch(err => {
					console.log('表单错误信息：', err);
				})
			}
		}
	}
</script>

<style scoped>
	.page {
		width: 100%;
		height: calc(100vh - 88rpx);
		background: #40a3ff;
		display: flex;
		flex-direction: column;
		justify-content: center;
	}

	.login {
		width: 90%;
		margin: 0 auto;
		background: #fff;
		padding: 100rpx 50rpx;
		box-sizing: border-box;
		border-radius: 15rpx;
		margin-bottom: 58px;
		box-shadow: 0px 0px 10px 4px rgb(0 0 0 / 30%);

	}

	.title {
		text-align: center;
		height: 40px;
		line-height: 40px;
		margin-bottom: 35px;
	}

	.title text {
		font-size: 50rpx;
		font-weight: bold;
		color: #40a3ff;
	}

	button {
		display: block;
		background: #40a3ff;
		color: #fff;
		font-size: 30rpx;
		width: 80%;
		height: 80rpx;
		line-height: 80rpx;
		margin-top: 100rpx;
	}
</style>